<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>机构管理</title>
	<script type="text/javascript">
		layui.use(function(){
			let treeTable = layui.treeTable;
			let rootId = "${not empty office.parent.id ? office.parent.id : '0'}";
			// 渲染
			let inst = treeTable.render({
				elem: '#ID-treeTable-demo'
				,url:  ctxAdmin + '/sys/office/officeTreeData?id=${office.id}'
				,tree: {view: {expandAllDefault:false},data:{isSimpleData:true,rootPid:rootId}}
				,escape : false
				,height: getLayuiTableHeight()
				,className: 'layui-table-custom'
				,cols: [[
					{type: 'numbers', title: '#',fixed: 'left', width: 40},
					{field: 'id', hide :true},
					{field: 'name', title: '机构名称'},
					{field: 'code', title: '机构编码',width: 80},
					{field: 'type', title: '机构类型',width: 80,templet: function(val){
							return getDictLabel(${fns:toJson(fns:getDictList('sys_office_type'))}, val.type, '未知')}},
					{field: 'grade', title: '机构层级',align: 'center',width: 80},
					{field:'opt', title: '操作',align:'center',width: 180,fixed:'right', toolbar: "#TPL-treeTable-demo-tools"}
				]],
				done: function(res, curr, count){
					const _filteredData = treeTable.getNodesByFilter(inst.config.id, function(item){
						const _dataIndex = item['LAY_DATA_INDEX'];
						const _dataLevel = _dataIndex ? _dataIndex.length : 0;
						// console.log('item',item,'_dataIndex',_dataIndex,'_dataLevel',_dataLevel)
						return _dataLevel < 3;
					});

					_filteredData.map(d => d.expand({expandFlag: true, callbackFlag: false}));
				}
			});
			// 单元格工具事件
			treeTable.on('tool('+ inst.config.id +')', function (obj) {
				if (obj.event === "delete") {
					let url = ctxAdmin + '/sys/office/delete?id=' + obj.data.id;
					confirmSubmit(url,'确定删除该机构吗？');
				} else {
					popupLayerLeft($(this).text(),$(this).data('url') + obj.data.id);
				}
			});
		});
		function getDictLabel(data, value, defaultValue){
			console.log(data,value,defaultValue)
			for (var i=0; i<data.length; i++){
				var row = data[i];
				if (row.value == value){
					return row.label;
				}
			}
			return defaultValue;
		}
	</script>
</head>
<body>
<sys:message content="${message}"/>
<div class="card m-0 border-0">
	<table class="layui-hide" id="ID-treeTable-demo"></table>
</div>
<script type="text/html" id="TPL-treeTable-demo-tools">
	<div class="layui-btn-container">
		<a data-url="${ctxAdmin}/sys/office/form?id=" lay-event="update" class="btn btn-outline alpha-primary text-primary">修改</a>
		<a data-url="${ctxAdmin}/sys/office/form?parent.id=" lay-event="addChild" class="btn btn-outline alpha-primary text-primary">添加下级</a>
		<a lay-event="delete" class="btn btn-outline alpha-danger text-danger">删除</a>
	</div>
</script>
</body>
</html>